<template>
    <div>
        <el-dialog title="添加" :visible.sync="sate" width="30%" :before-close="handleClose">
            <!--  -->
            <div>
                <span>日期：</span><br />
                <el-date-picker v-model="dataTime" type="date" placeholder="选择日期">
                </el-date-picker>
            </div>
            <div>
                <span>姓名：</span>
                <el-input v-model="name" placeholder="请输入内容"></el-input>
            </div>
            <div>
                <span>地址：</span>
                <el-input v-model="adrss" placeholder="请输入内容"></el-input>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="addClick(false)">取 消</el-button>
                <el-button type="primary" @click="addClick(true)">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>


<script>
export default {
    props: {
        dialogVisible: {
            typeof: Boolean,
            default: false
        }
    },
    data() {
        return {
            sate: false,
            dataTime: '',
            name: '',
            adrss: ''
        };
    },
    watch: {
        dialogVisible: {
            deep: true,
            handler(old, news) {
                this.sate = old;
            }
        }
    },
    methods: {
        handleClose(done) {
            this.$confirm('确认关闭？')
                .then(_ => {
                    done();
                    this.$emit('addMss', false)
                })
                .catch(_ => { });
        },
        // 点击事件
        addClick(e) {
            this.sate = false;
            this.$emit('addMss', e)
        }
    }
};
</script>